<template>
  <view>
    <view>
      <u-tabs-swiper
        ref="uTabs"
        :list="nav"
        :current="current"
        active-color="#CC2266"
        inactive-color="#887788"
        bg-color="#DEDEDE"
        :is-scroll="false"
        bar-width="60"
        @change="tabsChange"
      ></u-tabs-swiper>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      nav: [
        {
          name: "作业",
        },
        {
          name: "考试",
        },
        {
          name: "已提交",
        },
        {
          name: "已审批",
        },
      ],
      current: 0,
    };
  },
  methods: {
    tabsChange(index) {
      console.log(index);
      this.current = index;
    },
    transition(e) {
      let dx = e.detail.dx;
      this.$refs.uTabs.setDx(dx);
    },
    animationfinish(e) {
      let current = e.detail.current;
      this.$refs.uTabs.setFinishCurrent(current);
      this.swiperCurrent = current;
      this.current = current;
    },
    onreachBottom() {},
  },
};
</script>
